<template>
  <div class="product">
     <Product-List-Item v-for="(item,i) in product" :key="i" :product-item= "item"/>
  </div>
</template>

<script>
import ProductListItem from './ProductListItem' 
export default {
  name: "ProductList",
  components: {
    ProductListItem
  },
  props: {
    product: {
      type: Array,
      default() {
        return [];
      },
    },
  },
};
</script>

<style>
.product{
    padding-top: 3px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    /* padding: 2px; */
}
</style>